<template>
  <view>
    <!-- 供应商列表 -->
    <view class="">
      <radiogroup :list="radiolist" @change="change"></radiogroup>
    </view>
    <!-- 确认按钮 -->
     <view class="bottom-btn">
        <up-button type="primary" block @click="confirmSelection">确认</up-button>
     </view>
  </view>
</template>

<script setup lang="ts">
import { route } from 'uview-plus'
import radiogroup from '@/components/radio-group/radio-group.vue'
// 响应式变量存储选中的供应商
const selectedSupplier = ref() // 初始选中第二个
const radiolist = reactive([
  {
    label: '牛肉批发市场',
    value: 1
  },
  {
    label: '广东菜万家供应链有限公司',
    value: 2
  }
])

const change = (value: string | number) => {
  selectedSupplier.value = value
}
/**
 * 确认选择供应商
 */
const confirmSelection = () => {
  // 检查是否已选择供应商
  if (selectedSupplier.value) {
    gotoIndex()
  } else {
    // 如果未选择供应商，提示用户选择供应商
    uni.showToast({
      title: '请选择供应商',
      icon: 'none'
    })
  }
}
const gotoIndex = () => {
  route({
    type: 'switchTab',
    url: '/pages/index/index'
  })
}
</script>

<style scoped lang="scss">
.bottom-btn {
    position: absolute;
    bottom: 40rpx;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
}
</style>
